<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8" %>
<%@include file="/static/common/taglib.jsp" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
    <title>用户管理</title>
    <%@include file="../../public/commonCss.jsp" %>
    <%@include file="../../public/commonJs.jsp" %>
</head>
<body class="ms-controller" ms-controller="main">
<div id="wrapper">
    <div class="boxmain whiteBox lrbox">
        <div class="lrboxmain borderL" style="margin-left:0%">
            <div class="from-header borderB contentbox">
                <div>
                    <span class="font14"> 所属分类:</span><a id="category"><span class=" fontOrange2">人员管理</span></a>
                    <span class="fr">
                        <button class="layui-btn layui-btn-small" ms-on-click="showUserLayer(1)">
                            <i class="layui-icon">&#xe608;</i> 添加
                        </button>
                        <input type="text" ms-duplex="page.searchKey" class="inputText" placeholder="搜索编号、姓名"/>
                        <select style="display: inline;" ms-duplex="page.roleType">
                            <option value="">--请选择角色--</option>
                            <c:forEach var="codeData" items="${codeDatas}">
                                <option value="${codeData.itemValue}">${codeData.itemText}</option>
                            </c:forEach>
                        </select>
                        <button class="layui-btn layui-btn-small layui-btn-normal"
                                ms-on-click="loadSearchData()">搜索</button>
                    </span>
                </div>
            </div>
            <div class="from-body withheader contentbox" style=" overflow: auto;">
                <table class="layui-table">
                    <thead>
                    <tr align="center">
                        <th>行号</th>
                        <th>人员编号</th>
                        <th>人员姓名</th>
                        <th>部门</th>
                        <th>角色</th>
                        <th>手机号</th>
                        <th width="200">操作</th>
                    </tr>
                    </thead>
                    <tbody>
                    <tr align="center" ms-repeat="datas">
                        <td>{{(page.currentPage-1)*page.pageSize+$index+1}}</td>
                        <td>{{el.userNum}}</td>
                        <td>{{el.username}}</td>
                        <td>{{el.depName}}</td>
                        <td>{{el.roleName}}</td>
                        <td>{{(el.phoneNum==''||el.phoneNum==null)?'-':el.phoneNum}}</td>
                        <td>
                            <button class="layui-btn layui-btn-small" ms-click="showUserLayer(el)">修改</button>
                            <button class="layui-btn  layui-btn-danger layui-btn-small" ms-click="deleteData(el)">删除
                            </button>
                        </td>
                    </tr>
                    </tbody>
                </table>
                <!-- 分页 -->
                <div id="demo" class="fenye">
                </div>
            </div>
        </div>
    </div>
    <!-- whitebox -->
</div>
<script type="text/javascript">
    var vm;
    avalon.ready(function () {
        vm = avalon.define({
            $id: "main",
            datas: [],//表格数据
            page: {
                currentPage: 1,
                pageSize: 15,
                totalPage: 0,
                searchKey: '',
                roleType: ""
            }
        });
        avalon.scan();
        loadTableData();
    });

    //弹出添加菜单对话框
    function showUserLayer(el) {
        var dataStr = el == 1 ? "" : ("?id=" + el.id);
        layer.open({
            type: 2,
            title: '操作',
            area: ['520px', '70%'],
            fix: false, //不固定
            maxmin: false,
            content: '${ctx}/userController/toUserForm.action' + dataStr
        });
    }

    //删除
    function deleteData(el) {
        layerUtil.confirm("确认删除吗？", function () {
            var dataStr = {id: el.id};
            ajaxUtil.post("${ctx}/userController/deleteUser.action", dataStr, false, function (data) {
                layerUtil.success("删除成功");
            })

        })
    }

    function loadTableData() {
        ajaxUtil.postDealCode("${ctx}/userController/selectOnePage.action", vm.$model.page, true, function (data) {
            vm.datas = data.result;
            vm.page.totalPage = data.totalPage;
            pageUtil.renderPage(vm.page, loadTableData, "demo");
        })
    }

    function loadSearchData() {
        loadTableData();
    }
</script>
</body>
</html>